import { Component, OnInit, TemplateRef, ViewChild } from '@angular/core';
import { MessageService } from '../../../core/service';
import { NzMessageService } from 'ng-zorro-antd';
import { LayoutRourteStatus } from 'src/app/model/status';
import * as echarts from 'echarts';

@Component({
    selector: 'app-member-center-home',
    templateUrl: './member-center-home.component.html',
    styleUrls: ['./member-center-home.component.scss']
})
export class MemberCenterHomeComponent implements OnInit {

    constructor(
        private msg: MessageService,
        private message: NzMessageService,
        // private notificationService: NzNotificationService,
    ) { }
    @ViewChild(TemplateRef) template: TemplateRef<{}>;

    private _layoutRourteStatus: LayoutRourteStatus = {
        url: 'center/home',
        isHiddeBreadcrumb: true,
        breadcrumbs: [
            { tragetTitle: '医生个人中心' }
        ]
    };

    public chartOption = {
        title : {
            text: '流转处方占比',
            subtext: '至今流转总量',
            x: 'center'
        },
        tooltip : {
            trigger: 'item',
            formatter: '{a} <br/>{b} : {c} ({d}%)'
        },
        toolbox: {
            show : false,
            feature : {
                mark : {show: false},
                dataView : {show: false, readOnly: false},
                magicType : {
                    show: false,
                    type: ['pie', 'funnel']
                },
                restore : {show: false},
                saveAsImage : {show: false}
            }
        },
        calculable : false,
        series : [
            {
                name: '处方操作',
                type: 'pie',
                radius : '40%',
                center : ['50%', '50%'],
                data: [
                    {value: 5, name: '未通过'},
                    {value: 1, name: '违规操作'},
                    {value: 94, name: '完成'}
                ]
            }
        ]
    };

public chartOption1 = {
    title : {
        text: '处方评价',
        subtext: '药品疗效反馈',
        x: 'center'
    },
    color: ['#3398DB'],
    tooltip : {
        trigger: 'axis',
        axisPointer : {            // 坐标轴指示器，坐标轴触发有效
            type : 'shadow'        // 默认为直线，可选为：'line' | 'shadow'
        }
    },
    grid: {
        left: '3%',
        right: '4%',
        bottom: '3%',
        containLabel: true
    },
    xAxis : [
        {
            type : 'category',
            data : ['药效', '取药', '服务'],
            axisTick: {
                alignWithLabel: true
            }
        }
    ],
    yAxis : [
        {
            type : 'value'
        }
    ],
    series : [
        {
            name:'直接访问',
            type:'bar',
            barWidth: '60%',
            data:[280, 180, 200]
        }
    ]
};

    public chartOption2 = {
        title : {
            text: '',
            subtext: ''
        },
        tooltip : {
            trigger: 'axis'
        },
        legend: {
            data: ['处方流转数量']
        },
        toolbox: {
            show : true,
            feature : {
                mark : {show: true},
                dataView : {show: true, readOnly: false},
                magicType : {show: true, type: ['line', 'bar']},
                restore : {show: true},
                saveAsImage : {show: true}
            }
        },
        calculable : true,
        xAxis : [
            {
                type : 'category',
                boundaryGap : false,
                data : ['05-25', '05-26', '05-27', '05-28', '05-29', '05-30', '05-31']
            }
        ],
        yAxis : [
            {
                type : 'value',
                axisLabel : {
                    formatter: '{value} 张'
                }
            }
        ],
        series : [
            {
                name: '审核处方数量',
                type: 'line',
                data: [125, 88, 234, 156, 115, 133, 261],
                markPoint : {
                    data : [
                        {type : 'max', name: '最大值'},
                        {type : 'min', name: '最小值'}
                    ]
                },
                markLine : {
                    data : [
                        {type : 'average', name: '平均值'}
                    ]
                }
            }
        ]
    };
    ngOnInit() {
        this.msg.sendLayoutRourteStatus(this._layoutRourteStatus);
        // const fruits = [
        //     { name: '【通知】: 2019-05-28 14:30', color: 'blue',text:' 电子处方号为：84385328573987 已审核通过',bColor:'#40a9ffd1'  },
        //     { name: '【异常】: 2019-05-28 14:30', color: 'red' ,text:' 电子处方号为：84385328573987 被退回' ,bColor:'#ff000087'},
        //     { name: '【反馈】: 2019-05-28 14:30', color: 'green',text:' 电子处方号为：84385328573987 问题咨询' ,bColor:'#52c41ad9'}
        //   ];
        //   fruits.forEach(fruit => {
        //     this.notificationService.template(this.template, {
        //         nzData: fruit,
        //         nzDuration:10000,
        //         nzStyle:{
        //             background: fruit.bColor
        //           },
        //      });
        //   });
    }
}



/**
 * @url 貨幣
 */
export interface UserBalance {
    availableBalance: number;
    coin: Coin;
}
/**
 * @merchantWithdrawalCashMinAmount 提现最小数
 * @merchantWithdrawalCashFeePercent 提现费率
 * @merchantWithdrawalCashFeeMin 最低提现费
 * @merchantWithdrawalCashAllowDecimal 提现小数位
 */
export interface Coin {
    active: string;
    merchantWithdrawalCashMinAmount: number;
    merchantWithdrawalCashFeePercent: number;
    merchantWithdrawalCashFeeMin: number;
    merchantWithdrawalCashAllowDecimal: number;
}
